@page "/Bullet_Chart"

<Tabs>
    <TabPane Key="1">
        <Tab>示例1</Tab>
        <ChildContent>
            <Bullet TItem="string" Config="config1" />
        </ChildContent>
    </TabPane>
    <TabPane Key="2">
        <Tab>示例2</Tab>
        <ChildContent>
            <Bullet @ref="chart2" TItem="string" Config="config2" OtherConfig="otherconfig2" />
        </ChildContent>
    </TabPane>
</Tabs>

@code{

    IChartComponent chart2;


    protected override void OnInitialized()
    {
        base.OnInitialized();



    }

    protected override void OnAfterRender(bool firstRender)
    {
         base.OnAfterRender(firstRender);
         return;
    }

    #region 示例1

    BulletConfig config1 = new BulletConfig()
    {
        Data = new BulletViewConfigData[]
{
            new BulletViewConfigData()
            {
              Title = "满意度",
                  Measures = new int[]{83 },
                  Targets = new int[]{90 },
            },
    },
        RangeMax = 100,
        Title = new Charts.Title()
        {
            Visible = true,
            Text = "基础子弹图",
        },
        Description = new Description()
        {
            Visible = true,
            Text = "设定子弹图的目标值(goal)和当前进度(value)，即可展示子弹图进度情况；若没有设置最大值(max)，则最大值等于目标值",
        },
    };


    #endregion 示例1

    #region 示例2

    object otherconfig2 = new
    {
        legend =new
        {
            custom = true,
            items = new[]
            {
            new {
                name ="实际进度",
                marker =new  {
                    symbol = "square",
                    style = new
                    {
                        fill = "#5B8FF9",
                    },
                }
            },
           new {
               name ="目标值",
               marker =new  {
                   symbol = "line",
                   style = new
                   {
                       fill = "#5B8FF9",
                   },
               }
           },
             new {
                 name ="差",
                 marker =new  {
                     symbol = "square",
                     style = new
                     {
                         fill = "#FFB1AC",
                     },
                 }
             },

             new {
                 name ="良",
                 marker =new  {
                     symbol = "square",
                     style = new
                     {
                         fill = "#FFDBA2",
                     },
                 }
             },
            new {
                name ="优",
                marker =new  {
                    symbol = "square",
                    style = new
                    {
                        fill = "#B4EBBF",
                    },
                }
            },
         }

        }
    };




    BulletConfig config2 = new BulletConfig()
    {
        Title = new Charts.Title()
        {
            Visible = true,
            Text = "基础子弹图-带多颜色范围区间",
        },
        Description = new Description()
        {
            Visible = true,
            Text = "自定义图例，表示各颜色范围区间代表的含义（如差、良、优）",
        },
        Data = new BulletViewConfigData[]{
            new BulletViewConfigData
            {
                Title = "满意度",
                Measures = new [] {83 },
                Targets = new [] {90 },
                Ranges = new double[] {0,0.6,0.9,1},
            },
        },
        RangeMax = 100,
        RangeColors = new string[] { "#FFB1AC", "#FFDBA2", "#B4EBBF" },


    };



    #endregion 示例2


}

